<template>
    <div class="app-container">
        <el-form :model="queryParams" ref="queryTaskForm" v-show="showSearch" :inline="true" label-width="68px">
            <el-form-item label="处理状态" prop="disposeStatus">
                <el-select
                    v-model="queryParams.disposeStatus"
                    placeholder="特征任务处理状态"
                    clearable
                    style="width: 200px"
                    @change="handleQueryTask"
                >
                    <el-option
                        v-for="dict in sys_feature_task_status"
                        :key="dict.value"
                        :label="dict.label"
                        :value="dict.value"
                    />
                </el-select>
            </el-form-item>
            <el-form-item label="采集编号" prop="collectId">
                <el-input
                    v-model="queryParams.collectId"
                    placeholder="请输入采集编号"
                    clearable
                    style="width: 120px"
                    @keyup.enter="handleQueryTask"
                />
            </el-form-item>
            <el-form-item label="目标编号" prop="targetId">
                <el-input
                    v-model="queryParams.targetId"
                    placeholder="请输入目标编号"
                    clearable
                    style="width: 120px"
                    @keyup.enter="handleQueryTask"
                />
            </el-form-item>
            <el-form-item label="创建时间" style="width: 308px">
                <el-date-picker
                    v-model="queryDateRange"
                    value-format="YYYY-MM-DD"
                    type="daterange"
                    range-separator="-"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    @change="handleQueryTask"
                ></el-date-picker>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="Search" @click="handleQueryTask">搜索</el-button>
                <el-button icon="Refresh" @click="resetQueryTask">重置</el-button>
            </el-form-item>
        </el-form>
        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button
                    type="primary"
                    plain
                    icon="Plus"
                    @click="handleAddTask"
                >新增</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="danger"
                    plain
                    icon="Delete"
                    :disabled="multiple"
                    @click="handleDeleteTask"
                >删除</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="warning"
                    plain
                    icon="Download"
                    @click="handleExport"
                    v-hasPermi="['system:role:export']"
                >导出</el-button>
            </el-col>
            <right-toolbar v-model:showSearch="showSearch" @queryTable="getTaskList"></right-toolbar>
        </el-row>

        <!-- 表格数据 -->
        <el-table v-loading="loading" :data="featureTaskList" @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column
                label="序号"
                type="index"
                width="50"
                align="center">
                <template #default="scope">
                    {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
                </template>
            </el-table-column>
<!--            <el-table-column label="任务编号" prop="cnId" width="120" />-->
            <el-table-column label="处理状态" prop="disposeStatus"  width="80">
            <template #default="scope">
                <dict-tag :options="sys_feature_task_status" :value="scope.row.disposeStatus" />
            </template>
            </el-table-column>
            <el-table-column label="采集编号" align="center" key="collectId" prop="collectId" v-if="addTaskDialog.showColumns[1].visible" :show-overflow-tooltip="true" />
            <el-table-column label="目标编号" align="center" key="targetId" prop="targetId" v-if="addTaskDialog.showColumns[2].visible" :show-overflow-tooltip="true" />
<!--            <el-table-column label="采集时间" align="center" key="collectTime" prop="collectTime" v-if="addTaskDialog.showColumns[3].visible" :show-overflow-tooltip="true" >-->
<!--                <template #default="scope">-->
<!--                    <span>{{ parseTime(scope.row.collectTime) }}</span>-->
<!--                </template>-->
<!--            </el-table-column>-->
            <el-table-column label="射频频率" align="center" key="rfFreq" prop="rfFreq" v-if="addTaskDialog.showColumns[4].visible"/>
            <el-table-column label="采样速率" align="center" key="sampleRate" prop="sampleRate" v-if="addTaskDialog.showColumns[5].visible"/>
            <el-table-column label="记录格式" align="center" key="collectFormat" prop="collectFormat" v-if="addTaskDialog.showColumns[6].visible">
                <template #default="scope">
                    <dict-tag :options="sys_data_format_type" :value="scope.row.collectFormat" />
                </template>
            </el-table-column>
            <el-table-column label="正反谱" align="center" key="spectrum" prop="spectrum" v-if="addTaskDialog.showColumns[7].visible">
                <template #default="scope">
                    <dict-tag :options="sys_data_spectrum_type" :value="scope.row.spectrum" />
                </template>
            </el-table-column>
            <el-table-column label="数据地址" align="center" key="dataFile" prop="dataFile" v-if="false"/>
            <el-table-column label="创建时间" align="center" prop="createTime">
                <template #default="scope">
                    <span>{{ parseTime(scope.row.createTime) }}</span>
                </template>
            </el-table-column>
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                <template #default="scope">
                    <el-tooltip content="详细" placement="top" >
                        <el-button link type="primary" icon="View" @click="handleDetails(scope.row)" ></el-button>
                    </el-tooltip>
                    <el-tooltip content="删除" placement="top" v-if="scope.row.disposeStatus === 2">
                        <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" ></el-button>
                    </el-tooltip>
                </template>
            </el-table-column>
        </el-table>

        <pagination
            v-show="featureTaskTotal > 0"
            :total="featureTaskTotal"
            v-model:page="queryParams.pageNum"
            v-model:limit="queryParams.pageSize"
            @pagination="getTaskList"
        />

        <!-- 添加任务对话框 -->
        <el-dialog :title="addTaskDialog.title" v-model="addTaskDialog.open" append-to-body fullscreen>
            <el-row :gutter="10" class="">
                <el-form :model="addTaskDialog.queryParams" ref="querySampleForm" :inline="true" v-show="addTaskDialog.showSearch" label-width="68px">
                    <el-form-item label="采集编号" prop="collectId">
                        <el-input
                            v-model="addTaskDialog.queryParams.collectId"
                            placeholder="请输入采集编号"
                            clearable
                            style="width: 120px"
                            @keyup.enter="handleQueryMetAnalogData"
                        />
                    </el-form-item>
                    <el-form-item label="目标编号" prop="targetId">
                        <el-input
                            v-model="addTaskDialog.queryParams.targetId"
                            placeholder="请输入目标编号"
                            clearable
                            style="width: 120px"
                            @keyup.enter="handleQueryMetAnalogData"
                        />
                    </el-form-item>
                    <el-form-item label="创建时间" style="width: 308px;">
                        <el-date-picker
                            v-model="addTaskDialog.queryDateRange"
                            value-format="YYYY-MM-DD"
                            type="daterange"
                            range-separator="-"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                            @change="handleQueryMetAnalogData"
                        ></el-date-picker>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" icon="Search" @click="handleQueryMetAnalogData">搜索</el-button>
                        <el-button icon="Refresh" @click="resetQueryMetAnalogData">重置</el-button>
                    </el-form-item>
                </el-form>
            </el-row>
            <el-row :gutter="10" class="">
                <right-toolbar v-model:showSearch="addTaskDialog.showSearch" @queryTable="handleQueryMetAnalogData" :columns="addTaskDialog.showColumns"></right-toolbar>
            </el-row>
            <el-row :gutter="10" class="">
                <el-table v-loading="addTaskDialog.loading" :data="addTaskDialog.dataList"  @selection-change="handleSelectionChangeMetAnalogData">
                    <el-table-column type="selection" width="50" align="center" />
                    <el-table-column
                        label="序号"
                        type="index"
                        width="50"
                        align="center">
                        <template #default="scope">
                            {{ (addTaskDialog.queryParams.pageNum - 1) * addTaskDialog.queryParams.pageSize + scope.$index + 1 }}
                        </template>
                    </el-table-column>
                    <el-table-column label="id" align="center" key="cnId" prop="cnId" v-if="addTaskDialog.showColumns[0].visible" />
                    <el-table-column label="采集编号" align="center" key="collectId" prop="collectId" v-if="addTaskDialog.showColumns[1].visible" :show-overflow-tooltip="true" />
                    <el-table-column label="目标编号" align="center" key="targetId" prop="targetId" v-if="addTaskDialog.showColumns[2].visible" :show-overflow-tooltip="true" />
                    <el-table-column label="采集时间" align="center" key="collectTime" prop="collectTime" v-if="addTaskDialog.showColumns[3].visible" :show-overflow-tooltip="true" >
                        <template #default="scope">
                            <span>{{ parseTime(scope.row.collectTime) }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="射频频率" align="center" key="rfFreq" prop="rfFreq" v-if="addTaskDialog.showColumns[4].visible"/>
                    <el-table-column label="采样速率" align="center" key="sampleRate" prop="sampleRate" v-if="addTaskDialog.showColumns[5].visible"/>
                    <el-table-column label="记录格式" align="center" key="collectFormat" prop="collectFormat" v-if="addTaskDialog.showColumns[6].visible">
                        <template #default="scope">
                            <dict-tag :options="sys_data_format_type" :value="scope.row.collectFormat" />
                        </template>
                    </el-table-column>
                    <el-table-column label="正反谱" align="center" key="spectrum" prop="spectrum" v-if="addTaskDialog.showColumns[7].visible">
                        <template #default="scope">
                            <dict-tag :options="sys_data_spectrum_type" :value="scope.row.spectrum" />
                        </template>
                    </el-table-column>
                    <el-table-column label="入库人" align="center" key="createBy" prop="createBy" v-if="addTaskDialog.showColumns[8].visible"/>
                    <el-table-column label="入库时间" align="center" key="createTime" prop="createTime" v-if="addTaskDialog.showColumns[9].visible" :show-overflow-tooltip="true">
                        <template #default="scope">
                            <span>{{ parseTime(scope.row.createTime) }}</span>
                        </template>
                    </el-table-column>
                </el-table>
            </el-row>
            <el-row>
                <pagination
                    v-show="addTaskDialog.dataTotal > 0"
                    :total="addTaskDialog.dataTotal"
                    v-model:page="addTaskDialog.queryParams.pageNum"
                    v-model:limit="addTaskDialog.queryParams.pageSize"
                    @pagination="getMetAnalogDataList"
                />
            </el-row>
            <template #footer>
                <div class="dialog-footer">
                    <el-button type="primary" :disabled="addTaskDialog.multiple" @click="submitAddTask">确 定</el-button>
                    <el-button @click="cancelAddTask">取 消</el-button>
                </div>
            </template>
        </el-dialog>
        <!-- 任务详情对话框 -->
        <el-dialog :title="taskDeatilsDialog.title" v-model="taskDeatilsDialog.open" append-to-body fullscreen>
            <el-row :gutter="10">
                <el-col :sm="24" :lg="20">
                    <el-row class="">
                        <SpectrumView style="max-height: 300px" ref="spectrum" :v-show-type='1' :v-fft-data="taskDeatilsDialog.fftData" :v-wave-data="taskDeatilsDialog.waveData"></SpectrumView>
                    </el-row>
                    <el-row :gutter="0" class="">
                        <right-toolbar :search="false" @queryTable="getTaskDetails"></right-toolbar>
                    </el-row>
                    <el-row :gutter="0" class="">
                        <el-table v-loading="taskDeatilsDialog.loading" :data="taskDeatilsDialog.dataList" @row-click="getInfoDetail">
                            <!--                    <el-table-column type="selection" width="55" align="center" />-->
                            <el-table-column
                                label="序号"
                                type="index"
                                width="50"
                                align="center">
                                <template #default="scope">
                                    {{ (taskDeatilsDialog.queryParams.pageNum - 1) * taskDeatilsDialog.queryParams.pageSize + scope.$index + 1 }}
                                </template>
                            </el-table-column>
<!--                            <el-table-column label="任务编号" align="center" key="cnId" prop="cnId" v-if="false"/>-->
                            <el-table-column label="载波编号" align="center" key="carrierId"  prop="carrierId"/>
                            <el-table-column label="处理状态" prop="disposeStatus">
                                <template #default="scope">
                                    <dict-tag :options="sys_feature_info_status" :value="scope.row.disposeStatus" />
                                </template>
                            </el-table-column>
                            <el-table-column label="载波频率" align="center" key="carrierFreq" prop="carrierFreq" :show-overflow-tooltip="true" />
                            <!--                    <el-table-column label="载波中频" align="center" key="carrierCenterFreq" prop="carrierCenterFreq" :show-overflow-tooltip="true" />-->
                            <el-table-column label="载波带宽" align="center" key="carrierBand" prop="carrierBand" :show-overflow-tooltip="true" />
                            <el-table-column label="载噪比" align="center" key="carrierSnr" prop="carrierSnr"/>
                            <el-table-column label="传输方式" align="center" key="tranType" prop="tranType" />
                            <el-table-column label="调制速率" align="center" key="modelRate" prop="modelRate" />
                            <el-table-column label="调制方式" align="center" key="modelType" prop="modelType" />
                            <el-table-column label="编码方式" align="center" key="codeType" prop="codeType" />
                            <el-table-column label="编码码率" align="center" key="codeRate" prop="codeRate" />
                            <!--                    <el-table-column label="编码其他信息" align="center" key="codeOther" prop="codeOther" />-->
                            <el-table-column label="频率数据" align="center" key="freqData" prop="freqData" v-if="false" />
                            <el-table-column label="速率数据" align="center" key="rateData" prop="rateData"  v-if="false"/>
                            <el-table-column label="矢量数据" align="center" key="vectorData" prop="vectorData"  v-if="false"/>
                        </el-table>
                    </el-row>
                    <el-row>
                        <pagination
                            v-show="taskDeatilsDialog.dataTotal > 0"
                            :total="taskDeatilsDialog.dataTotal"
                            v-model:page="taskDeatilsDialog.queryParams.pageNum"
                            v-model:limit="taskDeatilsDialog.queryParams.pageSize"
                            @pagination="getTaskDetails"
                        />
                    </el-row>
                </el-col>
                <el-col :sm="24" :lg="4">
                    <el-row style="padding-bottom:10px;margin:0;height: 250px"><RateView ref="freqView"  :v-draw-data="taskDeatilsDialog.freqData"/></el-row>
                    <el-row style="padding-bottom:10px;margin:0;height: 250px"><RateView ref="rateView" :v-draw-type="2" :v-draw-data="taskDeatilsDialog.rateData"/></el-row>
                    <el-row style="padding-bottom:10px;margin:0;height: 250px"><VectorView :v-draw-data="taskDeatilsDialog.vectorData" /></el-row>
                </el-col>
            </el-row>
            <template #footer>
                <div class="dialog-footer">
                    <el-button  type="primary" @click="taskDeatilsDialogClose">关闭</el-button>
                </div>
            </template>
        </el-dialog>
    </div>
</template>

<script>
import {
    deleteRadioFeatureTask, getRadioFeatureTask,
    insertSysRadioFeatureTaskByMetAnalogDataIds,
    listRadioFeatureTask
} from "@/api/signal/radioFeatureTask";
import {addDateRange, parseTime} from "@/utils/ruoyi";
import {getMetAnalogDataUnFeature} from "@/api/signal/metAnalogData";
import {listRadioFeatureInfo} from "@/api/signal/radioFeatureInfo";

import DSP from 'dsp.js';
import {
    Int16Array2Float32Array,
    Int8Array2Float32Array,
    Int8Array2Int16Array,
    readFileData
} from "@/api/signal/fileData";
import RateView from "@/components/rateView/index.vue";

export default {
    name:'Featuretask',
    components: {RateView},
    props: [],
    data() {
        return {
            featureTaskList:[],
            ids:[],
            multiple:true,//选中任务
            loading:false,
            featureTaskTotal:0,
            showSearch:true,
            queryDateRange: [],
            queryParams:{
                pageNum: 1,
                pageSize: 10,
                disposeStatus: "",
                targetId:"",
                collectId:""
            },
            addTaskDialog:{ //《服务样本选择》Dialog
                loading:false,
                open:false,
                title: '添加无线电特征提取任务',//《服务样本选择》Dialog 的标题
                dataTotal:0,
                ids:[],
                multiple:true,//选中样本
                dataList:[],
                showSearch:true,
                disposeStatusOptions:[{label:'全部状态',value:0},{label:'已处理',value:1},{label:'未处理',value:2}],
                queryParams:{
                    pageNum: 1,
                    pageSize: 10,
                    targetId:"",
                    collectId:""
                },
                queryDateRange: [],
                showColumns: [
                    { key: 0, label: `Id`, visible: true },
                    { key: 1, label: `采集编号`, visible: true },
                    { key: 2, label: `目标编号`, visible: true },
                    { key: 3, label: `采集时间`, visible: true },
                    { key: 4, label: `射频频率`, visible: true },
                    { key: 5, label: `采样速率`, visible: true },
                    { key: 6, label: `记录格式`, visible: true },
                    { key: 7, label: `正反谱`, visible: true },
                    { key: 8, label: `入库人`, visible: true },
                    { key: 9, label: `入库时间`, visible: true }
                ]
            },
            taskDeatilsDialog:{
                loading:false,
                open:false,
                title: '无线电特征提取结果详情',//《服务样本选择》Dialog 的标题
                dataTotal:0,
                ids:[],
                multiple:true,//选中样本
                dataList:[],
                fftData:[],
                waveData:[],
                freqData:[],
                rateData:[],
                vectorData:[],
                queryParams:{
                    taskId:null,
                    pageNum: 1,
                    pageSize: 10,
                },
                chooseInfoId:null,//当前选中的载波id
                taskInfo:{
                    sampleRate:0,
                    sampleFreq:0,
                    dataPath:''
                }
            },
            rules: {

            },
            sys_feature_task_status: [],
            sys_data_format_type: [],
            sys_data_spectrum_type:[],
            sys_feature_info_status:[],
        }
    },
    computed: {},
    watch: {},
    created() {
        let { sys_feature_task_status, sys_data_format_type, sys_data_spectrum_type, sys_feature_info_status} = this.useDict("sys_feature_task_status","sys_data_format_type","sys_data_spectrum_type","sys_feature_info_status");
        this.sys_feature_task_status = sys_feature_task_status
        this.sys_data_format_type = sys_data_format_type
        this.sys_data_spectrum_type = sys_data_spectrum_type
        this.sys_feature_info_status = sys_feature_info_status
    },
    mounted() {
        this.handleQueryTask()
    },
    methods: {
        parseTime,
        getTaskList(){
            this.loading = true
            //alert(this.queryParams.disposeStatus)
            listRadioFeatureTask(addDateRange(this.queryParams, this.queryDateRange)).then(response => {
                this.featureTaskList = response.rows
                this.featureTaskTotal = response.total
                this.loading = false
            })
        },
        handleQueryTask() { //重新搜搜
            this.queryParams.pageNum = 1
            this.getTaskList()
        },
        resetQueryTask() { //重置搜索参数
            this.queryDateRange = []
            this.$refs['queryTaskForm'].resetFields()
            this.queryParams.disposeStatus=''
            this.handleQueryTask()
        },
        handleAddTask(){ //打开添加任务对话框
            this.addTaskDialog.open = true
            this.handleQueryMetAnalogData()
        },
        handleSelectionChange(selection){ //添加任务样本列表复选框勾选
            this.ids = selection.map(item => item.cnId);
            this.multiple = !selection.length
        },
        handleDeleteTask(){ //删除任务
            const that = this
            this.$modal.confirm('是否确认删除编号为"' + this.ids + '"的数据项？').then(function () {
                deleteRadioFeatureTask(that.ids).then(response => {
                    that.$modal.msgSuccess(response.msg)
                    that.getTaskList()
                })
            })
        },
        getMetAnalogDataList(){
            this.addTaskDialog.loading = true
            getMetAnalogDataUnFeature(addDateRange(this.addTaskDialog.queryParams, this.addTaskDialog.queryDateRange)).then(response => {
                this.addTaskDialog.dataList = response.rows
                this.addTaskDialog.dataTotal = response.total
                this.addTaskDialog.loading = false
            })
        },
        handleQueryMetAnalogData() {
            this.addTaskDialog.queryParams.pageNum = 1
            this.getMetAnalogDataList()
        },
        resetQueryMetAnalogData() {
            this.addTaskDialog.queryDateRange = []
            this.$refs['querySampleForm'].resetFields()
            this.handleQueryMetAnalogData()
        },
        handleSelectionChangeMetAnalogData(selection){
            this.addTaskDialog.ids = selection.map(item => item.cnId);
            this.addTaskDialog.multiple = !selection.length
        },
        submitAddTask(){
            this.addTaskDialog.loading = true
            insertSysRadioFeatureTaskByMetAnalogDataIds(this.addTaskDialog.ids).then(response => {
                this.$modal.msgSuccess(response.msg);
                this.addTaskDialog.loading = false
                this.handleQueryTask()
            })
            this.addTaskDialog.open = false
        },
        cancelAddTask(){
            this.addTaskDialog.open = false
        },
        handleDelete(row){
            const that = this
            let idList = []
            idList.push(row.cnId);
            this.$modal.confirm('是否确认删除编号为"' + idList + '"的数据项？').then(function () {
                deleteRadioFeatureTask(idList).then(response => {
                    that.$modal.msgSuccess(response.msg)
                    that.getTaskList()
                })
            }).catch(function () {

            })
        },
        /**
         * 查看任务详情
         * @param row
         */
        handleDetails(row){
            this.taskDeatilsDialog.open = true
            this.taskDeatilsDialog.queryParams.taskId = row.cnId
            this.taskDeatilsDialog.taskInfo.sampleFreq = row.rfFreq
            this.taskDeatilsDialog.taskInfo.sampleRate = row.sampleRate
            this.taskDeatilsDialog.taskInfo.dataPath = row.dataFile
            // getRadioFeatureTask(this.taskDeatilsDialog.queryParams.taskId).then(response => {
            //     alert(JSON.stringify(response.data))
            // })
            this.getSpectrumData()
            this.queryTaskDetails()
        },
        /**
         * 关闭任务详情对话框
         */
        taskDeatilsDialogClose(){
            this.taskDeatilsDialog.open = false
        },
        /**
         * 查询任务结果列表
         */
        queryTaskDetails(){
            this.taskDeatilsDialog.queryParams.pageNum = 1
            this.getTaskDetails()
        },
        /**
         * 根据参数获取任务详情（结果列表）
         */
        getTaskDetails(){
            this.taskDeatilsDialog.loading = true
            //获取任务处理结果信息table
            listRadioFeatureInfo(this.taskDeatilsDialog.queryParams).then(response => {
                this.taskDeatilsDialog.dataList = response.rows
                this.taskDeatilsDialog.dataTotal = response.total
            })
            this.taskDeatilsDialog.loading = false
        },
        /**
         * 获取载波数据
         * @param row
         */
        getInfoDetail(row){
            if(this.taskDeatilsDialog.chooseInfoId === row.cnId){ //避免重复拉取数据
                return
            }
            this.taskDeatilsDialog.chooseInfoId = row.cnId
            this.$nextTick(()=> {
                this.$refs.spectrum.chooseShow = true
                this.$refs.spectrum.chooseBeginFreq = row.carrierFreq - row.carrierBand/2000
                this.$refs.spectrum.chooseEndFreq = row.carrierFreq + row.carrierBand/2000
                this.$refs.spectrum.paint()
                this.$refs.freqView.drawType = 2;
            })
            // this.$modal.loading("正在获取载波数据，请稍候...")
            //获取数据
            readFileData(row.freqData,0,0).then(response => {
                let c_data = new Int8Array(response)
                let f_data = new Float32Array(c_data.buffer)
                console.log(f_data.length)
                this.taskDeatilsDialog.freqData = f_data
            })
            readFileData(row.rateData,0,0).then(response => {
                console.log(row.rateData)
                let c_data = new Int8Array(response)
                let f_data = new Float32Array(c_data.buffer)
                this.taskDeatilsDialog.rateData = f_data
            })
            readFileData(row.vectorData,0,0).then(response => {
                console.log(row.rateData)
                let c_data = new Int8Array(response)
                let s_data = new Int16Array(c_data.buffer)
                this.taskDeatilsDialog.vectorData = s_data
            })
            // this.$modal.closeLoading()
        },
        /**
         * 获取频谱数据
         */
        getSpectrumData(){
            let that = this;
            this.$nextTick(()=> {
                this.$refs.spectrum.minFreq = this.taskDeatilsDialog.taskInfo.sampleFreq - this.taskDeatilsDialog.taskInfo.sampleRate/4;
                this.$refs.spectrum.maxFreq = this.taskDeatilsDialog.taskInfo.sampleFreq + this.taskDeatilsDialog.taskInfo.sampleRate/4;
                this.$refs.spectrum.leftFreq = this.taskDeatilsDialog.taskInfo.sampleFreq - this.taskDeatilsDialog.taskInfo.sampleRate/4;
                this.$refs.spectrum.rightFreq = this.taskDeatilsDialog.taskInfo.sampleFreq + this.taskDeatilsDialog.taskInfo.sampleRate/4;
                this.$refs.spectrum.paint()
            })
            readFileData(this.taskDeatilsDialog.taskInfo.dataPath,0,65536).then(response => {
                let c_data = new Int8Array(response)
                let s_data = new Int16Array(c_data.buffer)
                let signal = new Float32Array(s_data)

                that.taskDeatilsDialog.waveData = s_data

                const fft = new DSP.FFT(signal.length, 44100)
                for (let i = 0; i < signal.length; i++) {
                    signal[i] *= DSP.WindowFunction.Hann(signal.length, i)
                }
                fft.forward(signal)
                for (let i = 0; i < fft.spectrum.length; i++) {
                    fft.spectrum[i] = Math.log10(Math.sqrt(fft.spectrum[i] * fft.spectrum[i])) * 20.0
                }
                const data = []
                for (let i = 0; i < fft.spectrum.length; i += 1) {
                    data.push([( this.taskDeatilsDialog.taskInfo.sampleFreq - this.taskDeatilsDialog.taskInfo.sampleRate/4 + (this.taskDeatilsDialog.taskInfo.sampleRate/2) / fft.spectrum.length * i), fft.spectrum[i]])
                }
                that.taskDeatilsDialog.fftData = data
            });
        }
    }
}
</script>

<style scoped>
.el-pagination {
    text-align: center;
}
</style>